<%@ page pageEncoding="UTF-8"%>
<%@ include file="../common/head.jsp"%>
<!DOCTYPE html>
<html>
<head>
<title>${appTitle }</title>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="description" content="" />
<link rel="stylesheet" href="${ctx }/qiantai/static/css/bootstrap.min.css" />
<link rel="stylesheet" href="${ctx }/qiantai/static/css/font-awesome.min.css" />
<link rel="stylesheet" href="${ctx }/qiantai/static/css/courseopen.css">
<script src="${ctx}/qiantai/static/js/jquery.2.1.4.min.js"></script>
<link rel="stylesheet" type="text/css" href="${ctx }/qiantai/static/page/simplePagination.css" />
</head>
<body>
	<!-- 二级页面头部-->

	<section class="header-nav wrap">
		<div>
			<%@ include file="./menu.jsp"%>
		</div>
		<!-- 导航下方小分类-->
		<section class="header-nav-bottom wrap">
			<section class="container">
				<section class="row">
					<ul class="header-nav-bottom-list clearfix">
					</ul>
				</section>
			</section>
		</section>
	</section>
	<!-- 分类列表-->
	<section class="wrap sort-wrap">
		<div class="container">
			<div class="row">
				<!--按课程分类-->
				<div class="sort-toType clearfix type-i">
					<span class="pull-left title">分类：</span>
					<ul class="sort-type-l clearfix pull-left">
						<li class="pull-left sort-type-i active" data-code="" id="typeall">
							<a href="${ctx}/com/list.do?type=">全部</a>
						</li>
<!--						<li class="pull-left sort-type-i" data-code="1" id="type_${item.id }">
							<a href="${ctx}/com/list.do?s_typesel=科目一">科目一</a>
						</li>-->
						<li class="pull-left sort-type-i" data-code="1" id="type_${item.id }">
							<a href="${ctx}/com/list.do?s_typesel=科目二">科目二</a>
						</li>
						<li class="pull-left sort-type-i" data-code="1" id="type_${item.id }">
							<a href="${ctx}/com/list.do?s_typesel=科目三">科目三</a>
						</li>
<!--						<li class="pull-left sort-type-i" data-code="1" id="type_${item.id }">
							<a href="${ctx}/com/list.do?s_typesel=科目四">科目四</a>
						</li>-->
					</ul>
				</div>
				<!--课程状态-->
				<div class="sort-state clearfix">
					<ul class="clearfix pull-left sort-state-l">
						<li class="pull-left sort-state-i active" data-type="1">
							<a class="active" href="#">在线课程列表 </a>
						</li>
					</ul>
					<div class="pull-right">
						<section class="search-block clearfix pull-rigth">
							<form action="${ctx}/com/list.do" method="get" id="searchfrom">
							<input id="searchInput" name="s_courseName" value="${name }" class="search-input pull-left" type="text" placeholder="搜索课程名">
							<a id="searchKeywordBtn" class="search-btn pull-left" href="javascript:;" onclick="searchList()">
								<i class="search-icon fa fa-search"></i>
							</a>
							</form>
						</section>
					</div>
				</div>
			</div>
		</div>
	</section>
	<script type="text/javascript">
		var typeid = "${type}";
		if (typeid != "") {
			$("#type_" + typeid).addClass("active");
			$("#typeall").removeClass("active");
		}
		function searchList(){
			if($("#searchInput").val()!=""){
				$("#searchfrom").submit();
			}
		}
	</script>
	<!-- 课程列表-->
	<div id="pageTypeData">
		<!-- 课程列表-->
		<section class="wrap icourse-open-panel">
			<div class="container">
				<div class="row">
					<c:if test="${empty SESSION_PAGE.list }">
					<div style="margin-bottom: 30px">没有找到相关信息</div>
					</c:if>
					<ul class="icourse-open-list clearfix">
						<c:forEach items="${SESSION_PAGE.list }" var="item" varStatus="vitem">
							
							<li class="pull-left <c:if test="${vitem.count%5==0 }">last</c:if>"  >
								<div class="icourse-item-modulebox-mooc">
									<div class="icourse-img">
										<div class="icourse-type"></div>
										<a href="${ctx}/com/getCourse.do?uid=${item.id}"  >
											<img onerror="javascript:this.src='${ctx}/resource/no.jpg'" src="${ctx}/resource/${item.imgFile}">
										</a>
									</div>
									<div class="icourse-desc">
										<p class="icourse-desc-top-mooc">
											<a class="icourse-desc-title" href="${ctx}/com/getCourse.do?uid=${item.id}"  >
												<b>${item.courseName }</b>
											</a>
										</p>
										<p class="icourse-desc-center-mooc">
										<div class="icourse-desc-school">
											<b> ${item.typesel}</b>  
										</div>
										</p>
										<p class="icourse-desc-bottom-mooc clearfix">
											<span class="icourse-desc-time pull-left">${item.addDate }</span>
											<span class="icourse-study-mooc pull-right">
												<span class="icourse-study-cout">${item.viewCount }</span>
											</span>
										</p>
									</div>
								</div>
							</li>
						</c:forEach>

					</ul>
				</div>
			<div id="loadTypeData">
				<div style="display: block">
					<div class="bbs-larPagination-box">
						<div class="bbs-larPagination">
							<div class="l_page">
								 <div class="pager-bg">
									<div id="light-pagination" class="pagination"></div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
			</div>
		</section>
	</div>
	<script type="text/javascript" src="${ctx }/qiantai/static/page/jquery.simplePagination.js"></script>
	<script type="text/javascript">
		$('#light-pagination').pagination({
			pages: ${SESSION_PAGE.totalPage},
			cssStyle: 'light-theme',
			displayedPages: 5,
			currentPage:${SESSION_PAGE.currentPageNumber},
			edges: 7,
			hrefTextSuffix:'&type=${type}'
		// 	onPageClick:function(pageNumber, event){window.location="${ctx}/com/queryForum.do?pageNum="+pageNumber;}
		});
	</script>
	<!-- 首页底部-->
	<%@ include file="./footer.jsp"%>
</body>
</html>
